<template>
  <td :class="handleTdClassName" :style="handleTdStyle">
    <slot></slot>
  </td>
</template>

<script>
export default {
  name: 'AsTd',
  props: {
    leftWidth: {type: [String, Number], default: null},
    rightWidth: {type: [String, Number], default: null},
    fixed: {type: Boolean, default: false}
  },
  computed: {
    handleTdStyle() {
      let style = {};
      if (this.fixed) {
        if (this.leftWidth !== null) style.left = this.leftWidth.indexOf('px') > -1 ? this.leftWidth : this.leftWidth + 'px';
        if (this.rightWidth !== null) style.right = this.rightWidth.indexOf('px') > -1 ? this.rightWidth : this.rightWidth + 'px';
      }
      return style;
    },
    handleTdClassName() {
      if (this.fixed) return 'as-fiexd'
      return ''
    }
  }
}
</script>

<style lang="less" scoped>

</style>